<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/5/21
  Time: 11:05
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" href="admin/css/bootstrap.min.css" />
    <link rel="stylesheet" href="admin/css/font-awesome.min.css" />
    <link rel="stylesheet" href="admin/css/notifications/Lobibox.min.css">
    <script src="admin/js/vendor/jquery-1.12.4.min.js"></script>
    <script src="admin/js/bootstrap.min.js"></script>
    <script src="admin/js/notifications/Lobibox.js"></script>
    <script src="admin/js/jquery.cookie.min.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        body {
            background-color: #eeeeee;
        }
        .navbar-text a  {
            color: #ffffff;
        }
        .login-text {
            margin-right: 50px;
        }
        .logo {
            color: #E94F4C;
            font-size: 35px;
            display: inline-block;
        }
        .search-box {
            height: 48px;
        }
        .input-group-addon {
            background-color:#E94F4C;
            border: none;
            color: #ffffff;
        }
        .control-icon {
            position: absolute;
            top: 50%;
        }
        .mgt38 {
            margin-top: 30px;
        }
        .thumbnail a img {
            height: 200px;
            width: 200px;
        }
        .thumbnail .description {
            height: 40px;
            overflow: hidden;
        }
        a:hover {
            text-decoration: none;
        }
        h3, p {
            text-align: center;
        }
    </style>
</head>
<body>
<nav class="navbar navbar-default navbar-inverse navbar-static-top">
    <div class="container-fluid">
        <div class="navbar-header">
            <a href="index.jsp" class="navbar-brand" style="color: #ffffff;"><i class="fa fa-sign-language"></i> 寻欢易购</a>
        </div>
        <p class="navbar-text navbar-right">
            <a href="register.jsp">注册</a>
        </p>
    </div>
</nav>
<div class="container">
    <div class="row">
        <div class="col-xs-6 col-xs-push-3">
            <div class="panel panel-danger login-panel">
                <div class="panel-heading">
                    <!-- 面板的头部内容 -->
                    <h3 class="panel-title">用户登录</h3>
                </div>
                <div class="panel-body">
                    <form onsubmit="javascript: return false;">
                        <div class="form-group">
                            <label for="username">用户名</label>
                            <input type="text" class="form-control" autocomplete="off" id="username">
                        </div>
                        <div class="form-group">
                            <label for="password">密码</label>
                            <input type="password" class="form-control" autocomplete="off" id="password">
                        </div>
                        <div class="form-group">
                            <button onclick="userLogin()" class="btn btn-danger btn-block">登录</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    /**
     * 用户登录, 登录成功时候需要合并购物车数据
     */
    function userLogin() {
        var username = $('#username').val();
        var password = $('#password').val();
        //console.log('${pageContext.servletContext.contextPath}/servlet/end/login');
        $.ajax({
            url: '${pageContext.servletContext.contextPath}/servlet/end/login',
            type: 'post',
            data: {endName: username, endPassword: password},
            dataType: 'json',
            success: function (datas) {
                console.log(datas);
                if(datas.code>0) {
                    /**
                     * 如果登录成功:
                     *     1. 将用户名存储在本地cookie中。
                     *     2. 同步购物车数据；
                     *     3. 跳转上次的页面
                     */
                    //  1. 将用户名存储在本地cookie中。
                    //$.cookie('frontedUsername', username);
                    //跳转到指定页面
                    //console.log(datas.data);
                    window.location.href = datas.data;




                }else {  // 登录失败
                    showErrorBox(datas.msg);
                }
            }
        })
    }



    // 显示错误提示信息
    function showErrorBox(msgText) {
        Lobibox.notify('warning', {
            size: 'mini',
            delay: 2000,
            delayIndicator: false,
            title: false, //不给title
            msg: msgText,
            sound: false  // 不要音频
        })
    }
</script>